<template>
  <h2>{{ route.query.id ? "编辑角色" : "新增角色" }}</h2>
  <el-form>
    <el-form-item label="角色名称">
      <el-input></el-input>
    </el-form-item>
    <el-form-item label="角色描述">
      <el-input></el-input>
    </el-form-item>
    <el-form-item label="角色状态">
      <el-radio>启用</el-radio>
      <el-radio>禁用</el-radio>
    </el-form-item>
    <div>
      <el-button type="primary">保存</el-button>
    </div>
  </el-form>
</template>

<script lang="ts" setup>
import { useRoute } from "vue-router";
const route = useRoute();
// 新增角色的逻辑，就是 对表单进行验证，然后向服务器发请求

// 编辑的逻辑，如果有id传递过来，先把旧的数据展示，然后编辑之后，向服务器发请求

// 但是要注意，编辑/删除 的时候千万不动 原有 (商品/订单/超级管理员) 的数据
</script>

<style lang="less" scoped></style>
